<template>
  <div class="numToPage">
    <h2>数字滚动</h2>
    <div class="num-box">
      <div class="mb-20">
        资产金额:<countTo
          :startVal="startVal"
          :endVal="8767676"
          :duration="duration"
          style="color:#ff4343;font-size:24px"
        ></countTo>
        <span style="color:#ff4343;font-size:42px">
          rmb
        </span>
      </div>
      <!-- ['#ff4343', '#f69846', '#f6d54a', '#45dbf7', '#44aff0', '#4777f5', '#5045f6', '#ad46f3', '#f845f1']  
荧光绿:'#30ECA6' -->
      <div class="mb-20">
        营业金额:<countTo
          :startVal="startVal"
          :endVal="564546"
          :duration="duration"
          style="color:#f6d54a;font-size:24px"
        ></countTo>
        <span style="color:#f6d54a;font-size:42px">
          rmb
        </span>
      </div>
      <div class="mb-20">
        产业收入:<countTo
          :startVal="startVal"
          :endVal="58658542"
          :duration="duration"
          style="color:#44aff0;font-size:24px"
        ></countTo>
        <span style="color:#44aff0;font-size:42px">
          rmb
        </span>
      </div>
      <div class="mb-20">
        支出:<countTo
          :startVal="startVal"
          :endVal="234432"
          :duration="duration"
          style="color:#5045f6;font-size:24px"
        ></countTo>
        <span style="color:#5045f6;font-size:42px">
          rmb
        </span>
      </div>
      <div class="mb-20">
        总金额:<countTo
          :startVal="startVal"
          :endVal="9999999"
          :duration="duration"
          style="color:#30ECA6;font-size:24px"
        ></countTo>
        <span style="color:#30ECA6;font-size:32px">
          rmb
        </span>
      </div>
    </div>
    <el-button type="primary" @click="closeTag">关闭该标签页</el-button>
  </div>
</template>

<script>
import countTo from "vue-count-to";
import moment from 'moment';
export default {
  components: {
    countTo,
  },
  data() {
    return {
      // 需要滚动的时间
      duration: 2000,
      // 初始值
      startVal: 0,
      // 最终值
      endVal: 2018,
    };
  },
  mounted() {
  },
  updated() {
    console.log('更新--------------');
  },
  methods: {
    test() {
      console.log('test11111111');
    },
    closeTag() {
    // window.opener=null;window.close();// 返回上一步路由
    var userAgent = navigator.userAgent;
    if (userAgent.indexOf("Firefox") != -1 || userAgent.indexOf("Chrome") !=-1) {undefined
    window.open('','_self').close()}  //或

    // window.location.href = "about:blank"
    // }else {undefined
    // window.opener = null;
    // window.open("about:blank", "_self");
    // window.close();
    // }
    }
  },
};
</script>

<style lang="less" scoped>
.numToPage {
  padding: 50px;
  .num-box {
    font-size: 18px;
  }
}
</style>